<template>
  <div>
    <!-- 标题 -->
    <Nav :title="title"></Nav>
    <div class="addressList" v-if="data.address"  @click="toAddress">
      <div v-if="data.address.is_default==1?true:false" class="l-txt">默认</div>
      <div class="r-txt">
        <span class="txt-t">{{ data.address.address }}</span>
        <span class="txt-b"
          >{{ data.address.name }}{{ data.address.mobile }}</span
        >
      </div>
    </div>

    <div class="goods" v-if="data.goodsList">
      <ul class="goodsList">
        <li class="goods-item" v-for="item in data.goodsList" :key="item.id">
          <img class="img" :src="item.list_pic_url" alt="" />
          <div class="r-txt">
            <div class="txt-l">
              <p>{{ item.goods_name }}</p>
              <p>{{ item.retail_price }}</p>
            </div>
            <p>X{{ item.number }}</p>
          </div>
        </li>
      </ul>
    </div>

    <div class="price" v-if="data.address">
      <div class="txt">
        <span class="txt-t">总价</span>
        <span class="txt-b">${{ data.allPrise }}</span>
      </div>

      <div class="txt">
        <span class="txt-t">运费</span>
        <span class="txt-b">包邮</span>
      </div>

      <div class="txt">
        <span class="txt-t">优惠券</span>
        <span class="txt-b">暂无</span>
      </div>
    </div>

    <div class="footer">
      <div class="footer-r">
        实付<span class="txt">${{ data.allPrise }}</span>
      <button >付款</button>
      </div>

    </div>
  </div>
</template>

<script>
import { ref } from 'vue'
import { detailAction } from '@/api/cart/cart'
import { getListAction } from '@/api/user/user'
import { useStore } from 'vuex'
import { useRouter } from 'vue-router'
export default {
  name: 'OrderApi',
  setup () {
    const router = useRouter()
    const store = useStore()
    const addressId = ref('')
    const data = ref([])
    const flag = ref(false)
    const title = ref('确认订单')
    async function init () {
      if (!store.state.address) {
        const a = await getListAction({
          openId: localStorage.getItem('openId')
        })
        console.log(a)
      } else {
        addressId.value = store.state.address
      }
      const b = await detailAction({
        openId: localStorage.getItem('openId'),
        addressId: addressId.value
      })
      data.value = b
      console.log('12', b, data.value)
    }
    init()
    const toAddress = () => {
      router.push('/user/address')
    }
    const backTo = () => {
      router.back()
      store.state.address = ''
    }
    return { addressId, data, flag, toAddress, backTo, title }
  }
}
</script>

<style lang="scss" scoped>
@import './scss/index.scss'
</style>
